<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>新增-部门信息</title>
    <link rel="stylesheet" th:href="@{/resources/bootstrap/css/bootstrap.min.css}">
    <!-- Font Awesome -->
    <link rel="stylesheet" th:href="@{/resources/awi/css/font-awesome.min.css}">
    <!-- Theme style -->
    <link rel="stylesheet" th:href="@{/resources/awi/css/AdminLTE.min.css}">
    <link rel="stylesheet" th:href="@{/resources/awi/css/skins/all-skins.min.css}">
    <link rel="stylesheet" th:href="@{/resources/plugins/ztree/css/ztreeStyle/ztreeStyle.css}">
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="page-header">
                <h3>部门信息
                    <small>新增-部门信息</small>
                </h3>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="box box-solid box-info">
                <div class="box-body">
                    <form role="form" id="department-form" action="/department/save" method="post">
                        <input type="hidden" name="uid">
                        <div class="form-group">
                            <label for="name">部门名称 </label>
                            <input class="form-control" name="name" id="name" placeholder="部门名称">
                        </div>
                        <div class="form-group">
                            <label for="name">上级部门 </label>
                            <input type="hidden" name="parentDepartmentUid" id="parentDepartmentUid" value="0">
                            <input class="form-control" name="parentDepartmentName" id="parentDepartmentName" placeholder="点击选择上级部门" readonly onclick="setParentDepartment()">
                        </div>
                        <div class="form-group">
                            <label for="remarks">部门描述 </label>
                            <textarea name="remarks" rows="4" id="remarks" class="form-control">填写部门描述</textarea>
                        </div>
                    </form>

                </div>
                <div class="box-footer">
                    <button type="button" id="submitBtn" class="btn btn-primary pull-right" style="margin-left: 35px;"
                            onclick="submitForm('#department-form')">提交
                    </button>
                    <button type="button" id="resetBtn" class="btn btn-warning pull-right"
                            onclick="resetForm('#department-form')">重置
                    </button>
                </div>
            </div>


        </div>

    </div>

</div>
</body>
<!-- jQuery 2.2.3 -->
<script th:src="@{/resources/plugins/jQuery/jquery-2.2.3.min.js}"></script>
<!-- Bootstrap 3.3.6 -->
<script th:src="@{/resources/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/resources/layer/layer.js}"></script>
<!-- AdminLTE App -->
<script th:src="@{/resources/awi/js/app.js}"></script>
<!--tabs-->
<script th:src="@{/resources/awi/js/app_iframe.js}"></script>
<script th:src="@{/resources/plugins/ztree/js/jquery.ztree.all.js}"></script>
<script th:src="@{/resources/commons/js/prototype.js}"></script>
<script type="text/javascript">
    function setParentDepartment(){
        var setting = {
            check: {
                enable: true,
                chkStyle: "radio",
                radioType: "all"
            },
            callback: {
                onCheck: parentCheck
            },
            data: {
                simpleData: {
                    enable: true
                }
            }
        };
        $.get("/department/listDepartmentTree",function(response){
            layer.open({
                title:'请选择上级部门',
                content:'<ul class="ztree" id="department-tree"></ul>',
                area:['300px','400px']
            });
            var ztree=$.fn.zTree.init($("#department-tree"), setting, response.data);
        })
    }
    function parentCheck(event, treeId, treeNode) {
        $("#parentDepartmentUid").val(treeNode.id);
        $("#parentDepartmentName").val(treeNode.name);
    };
</script>
</html>